<div><input type="text" value="google" id="twitterLetterParticlesTestUserName" />'s latest tweets (Does not work with languages without spacing between words.</div>
<div id="twitterLetterParticlesTestLetters"></div>
<!--
<div id="twitterLetterParticlesTestPhysicalHtmlFloor0"> </div>
<div id="twitterLetterParticlesTestPhysicalHtmlFloor1"> </div>
<div id="twitterLetterParticlesTestPhysicalHtmlFloor2"> </div>
<div id="twitterLetterParticlesTestPhysicalHtmlFloor3"> </div>
<div id="twitterLetterParticlesTestPhysicalHtmlFloor4"> </div>
-->
<div id="twitterLetterParticlesTestTestconsole" style="position: absolute; left: 50px; top:350px;"></div>

<!--<button id="twitterLetterParticlesTestPhysicalHtmlRestart" >Start over</button>-->

<script stype="text/javascript">
var twitterLetterParticlesTestTimerID;
var twitterLetterParticlesTestTweetCount = 0;
var twitterLetterParticlesTestUpdateInterval = 20000;
var twitterLetterParticlesTestRefetchTweetInterval = 3 * 60000;
var twitterLetterParticlesTestLastFetchTweetTime = 0;
function twitterLetterParticlesTest()
{
  twitterLetterParticlesTestLastFetchTweetTime = 0;
  twitterLetterParticlesTestElapsedTime = 0;
  twitterLetterParticlesTestTweetCount = 0;

  twitterLetterParticlesOnTimer(); // initial call
  clearInterval( twitterLetterParticlesTestTimerID );
  twitterLetterParticlesTestTimerID = setInterval( twitterLetterParticlesOnTimer, twitterLetterParticlesTestUpdateInterval);
  return true;
}

var twitterLetterParticlesTestElapsedTime = 0;
function twitterLetterParticlesOnTimer()
{
  var nTweetsToFetch = 5;
  twitterLetterParticlesTestTweetCount %= nTweetsToFetch;
  if (cachedTweets.length <= twitterLetterParticlesTestTweetCount){
    twitterLetterParticlesTestTweetCount = 0;
  }

  document.getElementById('twitterLetterParticlesTestLetters').removeEventListener("change", twitterLetterParticlesUpdate, true);

  document.getElementById('twitterLetterParticlesTestLetters').innerHTML = "";
  var userName = document.getElementById("twitterLetterParticlesTestUserName").value;

  document.getElementById('twitterLetterParticlesTestLetters').addEventListener("change", twitterLetterParticlesUpdate, true);
  
  if (cachedTweets.length == 0 || twitterLetterParticlesTestElapsedTime >= twitterLetterParticlesTestLastFetchTweetTime + twitterLetterParticlesTestRefetchTweetInterval){
    var url = "http://twitter.com/statuses/user_timeline/"+ userName + ".json?callback=twitterCacheCallback&count=" + nTweetsToFetch.toFixed(0);
    $.ajax({   type: "GET",   url: url,   dataType: "script" });
    twitterLetterParticlesTestTweetCount = 0;
    twitterLetterParticlesTestLastFetchTweetTime = twitterLetterParticlesTestElapsedTime;
  }
  if (cachedTweets.length == 0){
    if (twitterLetterParticlesTestElapsedTime <= twitterLetterParticlesTestUpdateInterval ){
      // Within the interval...so may be just delayed response from Twitter...
      twitterLetterParticlesTestElapsedTime += twitterLetterParticlesTestUpdateInterval;
      return;
    }
    else{
      // must have been an error
      cachedTweets[0] = "Opps, there was an error in fetching tweets. Try refreshing the browser after a few minutes.";
      cachedTweets[1] = "Doh, there was an error in fetching tweets. Try refreshing the browser after a few minutes.";
    }
  }

  document.getElementById("twitterLetterParticlesTestLetters").innerHTML = cachedTweets[twitterLetterParticlesTestTweetCount];

  twitterLetterParticlesTestDispatchEvent();

  twitterLetterParticlesTestElapsedTime += twitterLetterParticlesTestUpdateInterval;
}

function twitterLetterParticlesTestDispatchEvent()
{
  var event = document.createEvent("HTMLEvents");
  event.initEvent("change", true, true);
  document.getElementById("twitterLetterParticlesTestLetters").dispatchEvent(event);
}

var twitterLetterParticlesTestPhysicalHtml = new physHtml.main("twitterLetterParticlesTestPhysicalHtml");
function twitterLetterParticlesUpdate()
{
  var nRows = 4;
  var rowInterval = 50;
  var maxLettersPerRow = 50;
  var letterWidth = 13;
  var letterHeight = 20;

  twitterLetterParticlesTestTweetCount++;

  if (twitterLetterParticlesTestPhysicalHtml.state == 1){
    twitterLetterParticlesTestPhysicalHtml.stop();
  }

  twitterLetterParticlesTestPhysicalHtml = new physHtml.main("twitterLetterParticlesTestPhysicalHtml");
  var twitterStatus = document.getElementById("twitterLetterParticlesTestLetters").innerHTML.replace(/(<([^>]+)>)/ig,"");
  document.getElementById("twitterLetterParticlesTestLetters").innerHTML = "";

  twitterLetterParticlesTestPhysicalHtml.initialize();  
  twitterLetterParticlesTestPhysicalHtml.maxTime = twitterLetterParticlesTestUpdateInterval - 100;
  twitterLetterParticlesTestPhysicalHtml.console = document.getElementById("twitterLetterParticlesTestTestconsole");

  twitterLetterParticlesTestFactory = new physHtml.wordObjectFactory(twitterLetterParticlesTestPhysicalHtml);

  twitterLetterParticlesTestFactory.gravity = $V([0.0, 10 * 9.8]);
  twitterLetterParticlesTestFactory.offset = $V([-0.5, -0.5]);
  twitterLetterParticlesTestFactory.rotationOffset = $V([0.0, 0.0]);
  var style = "position:absolute; font-size:" + letterHeight + "px; color: #ff5555;";

  var words = twitterStatus.split(" ");
  var subWords = new Array();
  var index = 0;
  for (i = 0; i < nRows; i++){
    subWords[i] = "";
  }
  for (var i = 0; i < words.length; i++){
    if (subWords[index].length > 0 && subWords[index].length + words[i].length >= maxLettersPerRow ){
      index++;
    }
    subWords[index] += " " + words[i];
  }

  twitterLetterParticlesTestObjects = new Array(nRows);
  for (i = 0; i < nRows; i++){
    var strings = subWords[i].split(" ");

    for (j = 0; j < strings.length; j++){
      if (strings[j].substring(0, 7) == "http://"){
        var displayUrl = strings[j];
        if (displayUrl.length > 23){
          displayUrl = displayUrl.substring(0, 20) + "...";
        }
        strings[j] = "<a  href='" + strings[j] + "' target='new'>" + displayUrl + "</a>";
      }

//      this does not work well :(
      strings[j] = strings[j].replace(/\B@([_a-z0-9]+)/ig, function(reply) { return  reply.charAt(0)+'<a target="new" href="http://twitter.com/'+reply.substring(1)+'">'+reply.substring(1)+'</a>';} );
    }

    var position = $V([100, 120 + i * 60]);
    twitterLetterParticlesTestObjects[i] = twitterLetterParticlesTestFactory.createWordObjectsInElement("twitterLetterParticlesTest" + i.toFixed(0), strings, "twitterLetterParticlesTestLetters", position, letterWidth, letterHeight, style);
  }

  var floor = new Array(nRows);
  for (var i = 0; i < nRows; i++){
    floor[i] = new physHtml.wall( $V([1, 150 + rowInterval * i]), 0.0, 1000, 1, 0.8 );

    for (var j = 0; j < twitterLetterParticlesTestObjects[i].length; j++){
      twitterLetterParticlesTestObjects[i][j].connect(floor[i], floor[i]);
      twitterLetterParticlesTestObjects[i][j].velocity = $V([0.0, -50 - 5 * (j % 2 + i) ]);
      twitterLetterParticlesTestObjects[i][j].radius = letterHeight;
    }

//  var floorObjectHTML = new Array(nRows);
//    floorObjectHTML[i] = new physHtml.htmlObject(document.getElementById('twitterLetterParticlesTestPhysicalHtmlFloor' + i.toFixed(0) ), floor[i]);
//    twitterLetterParticlesTestPhysicalHtml.htmlObjects.addObject( floorObjectHTML[i] );
  }

  twitterLetterParticlesTestPhysicalHtml.start();
}
</script>
